<template>
  <a-card>
    <div slot="title">
      <span style="margin-right: 0.8rem">
        默认配置权限
      </span>
      <j-dict-select-tag v-model="type" placeholder="请选择配置类型" dictCode="org_type"
        style="width: 200px;margin-right: 0.8rem" @change="handleTypeChange" />
    </div>
    <div slot="extra">
      <a-dropdown style="float: left;margin-right: 0.8rem" :trigger="['click']" placement="topCenter">
        <a-menu slot="overlay">
          <a-menu-item key="1" @click="switchCheckStrictly(1)">父子关联</a-menu-item>
          <a-menu-item key="2" @click="switchCheckStrictly(2)">取消关联</a-menu-item>
          <a-menu-item key="3" @click="checkALL">全部勾选</a-menu-item>
          <a-menu-item key="4" @click="cancelCheckALL">取消全选</a-menu-item>
          <a-menu-item key="5" @click="expandAll">展开所有</a-menu-item>
          <a-menu-item key="6" @click="closeAll">合并所有</a-menu-item>
        </a-menu>
        <a-button>
          树操作 <a-icon type="up" />
        </a-button>
      </a-dropdown>

      <a-button @click="handleSubmit" type="primary" :loading="loading" ghost style="margin-right: 0.8rem">保存</a-button>
    </div>
    <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
      <span>首页会默认添加，是否勾选不影响; </span>
      <span>勾选子类需勾选父类，否则无法展示</span>
    </div>
    <a-form v-if="this.type">
      <a-form-item>
        <a-tree checkable @check="onCheck" :checkedKeys="checkedKeys" :treeData="treeData" @expand="onExpand"
          @select="onTreeNodeSelect" :selectedKeys="selectedKeys" :expandedKeys="expandedKeysss"
          :checkStrictly="checkStrictly">
          <span slot="hasDatarule" slot-scope="{slotTitle,ruleFlag}">
            {{ slotTitle }}<a-icon v-if="ruleFlag" type="align-left" style="margin-left:5px;color: red;"></a-icon>
          </span>
        </a-tree>
      </a-form-item>
    </a-form>
    <div v-else>
      <a-empty description="请选择类型" />
    </div>
  </a-card>
</template>

<script>

import { queryTreeListForRole, queryRolePermission, saveRolePermission } from '@/api/api'
import { getAction, putAction } from '../../../api/manage';

export default {
  name: 'defaultRouteConfig',
  data() {
    return {
      type: null,
      treeData: [],
      model: {},
      defaultCheckedKeys: [],
      checkedKeys: [],
      expandedKeysss: [],
      allTreeKeys: [],
      autoExpandParent: true,
      checkStrictly: true,
      title: "角色权限配置",
      visible: false,
      loading: false,
      selectedKeys: [],
      url: {
        save: "/platform/config/cyPlatformRouteConfig/save",
        get: "/platform/config/cyPlatformRouteConfig/get",
      }
    }
  },
  created() {
  },
  methods: {
    onTreeNodeSelect(id) {
      if (id && id.length > 0) {
        this.selectedKeys = id
      }

    },
    onCheck(o) {
      if (this.checkStrictly) {
        this.checkedKeys = o.checked;
      } else {
        this.checkedKeys = o
      }
    },
    onExpand(expandedKeys) {
      this.expandedKeysss = expandedKeys;
      this.autoExpandParent = false
    },
    expandAll() {
      this.expandedKeysss = this.allTreeKeys
    },
    closeAll() {
      this.expandedKeysss = []
    },
    checkALL() {
      this.checkedKeys = this.allTreeKeys
    },
    cancelCheckALL() {
      //this.checkedKeys = this.defaultCheckedKeys
      this.checkedKeys = []
    },
    switchCheckStrictly(v) {
      if (v == 1) {
        this.checkStrictly = false
      } else if (v == 2) {
        this.checkStrictly = true
      }
    },
    reset() {
      this.expandedKeysss = []
      this.checkedKeys = []
      this.defaultCheckedKeys = []
      this.loading = false
    },
    handleTypeChange() {
      this.loadData()
    },
    loadData() {
      queryTreeListForRole().then((res) => {
        this.treeData = res.result.treeList
        this.allTreeKeys = res.result.ids
        // 加载数据
        getAction(this.url.get, { type: this.type }).then((res) => {
          if (res.result) {
            this.model = res.result
            this.checkedKeys = [...res.result.comment.split(",")];
            this.defaultCheckedKeys = [...res.result.comment.split(",")];
          } else {
            this.model = {}
            this.checkedKeys = [];
            this.defaultCheckedKeys = [];
            this.expandedKeysss = this.allTreeKeys;
          }
        })
      })
    },

    handleSubmit() {
      let that = this;
      let params = {
        type: that.type,
        comment: that.checkedKeys.join(","),
      };
      that.loading = true;
      putAction(this.url.save, params).then((res) => {
        if (res.success) {
          that.$message.success(res.message);
          that.loading = false;
        } else {
          that.$message.error(res.message);
          that.loading = false;
        }
        this.loadData();
      })
    },

  }
}

</script>

<style lang="less"></style>